.plugin-tabs {
    width: 100%;
    height: 100%;
    overflow: hidden;

    :global {
        .ant-tabs {
            width: 100%;
            height: 100%;
        }

        // tabPosition = top
        .ant-tabs-top {
            & > .ant-tabs-nav {
                height: 25px;
                margin-bottom: 0;
                &::before {
                    border-bottom: 1px solid var(--Colors-Use-Neutral-Border);
                    // border-bottom: none;
                    z-index: 0;
                }
                .ant-tabs-ink-bar {
                    display: none;
                }

                // 基础样式
                .ant-tabs-tab {
                    padding: 4px 8px;
                    border-radius: 4px 4px 0px 0px;
                    border-top: 1px solid var(--Colors-Use-Neutral-Border);
                    border-right: 1px solid var(--Colors-Use-Neutral-Border);
                    border-left: 1px solid var(--Colors-Use-Neutral-Border);
                    border-bottom: 0;
                    background: var(--Colors-Use-Neutral-Bg-Hover);
                    .ant-tabs-tab-btn {
                        color: var(--Colors-Use-Neutral-Text-1-Title);
                        font-size: 12px;
                        font-weight: 400;
                        line-height: 16px;
                    }
                }
                .ant-tabs-tab + .ant-tabs-tab {
                    margin-left: 4px;
                }
                // 选中
                .ant-tabs-tab.ant-tabs-tab-active {
                    border-top: 1px solid var(--Colors-Use-Main-Border);
                    border-right: 1px solid var(--Colors-Use-Main-Border);
                    border-left: 1px solid var(--Colors-Use-Main-Border);
                    background: var(--Colors-Use-Main-Primary);
                    .ant-tabs-tab-btn {
                        color: var(--Colors-Use-Main-On-Primary);
                        text-shadow: unset;
                    }
                }
                // 禁用
                .ant-tabs-tab.ant-tabs-tab-disabled {
                    background: var(--Colors-Use-Neutral-Bg);
                    .ant-tabs-tab-btn {
                        color: var(--Colors-Use-Neutral-Disable);
                    }
                }
            }
        }
        // tabPosition = bottom
        .ant-tabs-bottom {
            & > .ant-tabs-nav {
                height: 25px;
                margin-top: 0;
                &::before {
                    border-top: 1px solid var(--Colors-Use-Neutral-Border);
                    z-index: 0;
                }
                .ant-tabs-ink-bar {
                    display: none;
                }

                // 基础样式
                .ant-tabs-tab {
                    padding: 4px 8px;
                    border-radius: 0px 0px 4px 4px;
                    border-bottom: 1px solid var(--Colors-Use-Neutral-Border);
                    border-right: 1px solid (--Colors-Use-Neutral-Border);
                    border-left: 1px solid (--Colors-Use-Neutral-Border);
                    border-top: 0;
                    background: var(--Colors-Use-Neutral-Bg-Hover);
                    .ant-tabs-tab-btn {
                        color: var(--Colors-Use-Neutral-Text-1-Title);
                        font-size: 12px;
                        font-weight: 400;
                        line-height: 16px;
                    }
                }
                .ant-tabs-tab + .ant-tabs-tab {
                    margin-left: 4px;
                }
                // 选中
                .ant-tabs-tab.ant-tabs-tab-active {
                    border-bottom: 1px solid var(--Colors-Use-Main-Border);
                    border-right: 1px solid var(--Colors-Use-Main-Border);
                    border-left: 1px solid var(--Colors-Use-Main-Border);
                    background: var(--Colors-Use-Main-Primary);
                    .ant-tabs-tab-btn {
                        color: var(--Colors-Use-Neutral-Text-1-Title);
                        text-shadow: unset;
                    }
                }
                // 禁用
                .ant-tabs-tab.ant-tabs-tab-disabled {
                    background: var(--Colors-Use-Neutral-Bg);
                    .ant-tabs-tab-btn {
                        color: var(--Colors-Use-Neutral-Disable);
                    }
                }
            }
        }

        // tabPosition = right
        .ant-tabs-right {
            & > .ant-tabs-nav {
                width: 21px;
                min-width: unset;
                &::before {
                    height: 100%;
                    position: absolute;
                    top: 0;
                    left: 0;
                    border-left: 1px solid var(--Colors-Use-Neutral-Border);
                    z-index: 0;
                    content: "";
                }
                .ant-tabs-ink-bar {
                    display: none;
                }

                // 基础样式
                .ant-tabs-tab {
                    width: 21px;
                    padding: 8px 4px;
                    border-radius: 0px 4px 4px 0px;
                    border-top: 1px solid (--Colors-Use-Neutral-Border);
                    border-right: 1px solid (--Colors-Use-Neutral-Border);
                    border-bottom: 1px solid (--Colors-Use-Neutral-Border);
                    border-left: 0;
                    background: var(--Colors-Use-Neutral-Bg-Hover);
                    border-color: var(--Colors-Use-Neutral-Border);
                    .ant-tabs-tab-btn {
                        color: var(--Colors-Use-Neutral-Text-1-Title);
                        font-size: 12px;
                        font-weight: 400;
                        line-height: 14px;
                        width: 12px;
                        writing-mode: vertical-rl;
                    }
                }
                .ant-tabs-tab + .ant-tabs-tab {
                    margin-top: 4px;
                }
                // 选中
                .ant-tabs-tab.ant-tabs-tab-active {
                    border-top: 1px solid var(--Colors-Use-Main-Border);
                    border-right: 1px solid var(--Colors-Use-Main-Border);
                    border-bottom: 1px solid var(--Colors-Use-Main-Border);
                    background: var(--Colors-Use-Main-Primary);
                    .ant-tabs-tab-btn {
                        color: var(--Colors-Use-Main-On-Primary);
                        text-shadow: unset;
                    }
                }
                // 禁用
                .ant-tabs-tab.ant-tabs-tab-disabled {
                    background: var(--Colors-Use-Neutral-Bg);
                    border-color: var(--Colors-Use-Neutral-Border);
                    .ant-tabs-tab-btn {
                        color: var(--Colors-Use-Neutral-Disable);
                    }
                }
            }

            & > .ant-tabs-content-holder {
                border-right: 0;
                margin-right: 0;
                & > .ant-tabs-content > .ant-tabs-tabpane {
                    padding-right: 0;
                }
            }
        }
        // tabPosition = left
        .ant-tabs-left {
            & > .ant-tabs-nav {
                width: 21px;
                min-width: unset;
                &::before {
                    height: 100%;
                    position: absolute;
                    top: 0;
                    right: 0;
                    border-right: 1px solid (--Colors-Use-Neutral-Border);
                    z-index: 0;
                    content: "";
                }
                .ant-tabs-ink-bar {
                    display: none;
                }

                // 基础样式
                .ant-tabs-tab {
                    width: 21px;
                    padding: 8px 4px;
                    border-radius: 4px 0px 0px 4px;
                    border-top: 1px solid (--Colors-Use-Neutral-Border);
                    border-left: 1px solid (--Colors-Use-Neutral-Border);
                    border-bottom: 1px solid (--Colors-Use-Neutral-Border);
                    border-right: 0;
                    background: var(--Colors-Use-Neutral-Bg-Hover);
                    .ant-tabs-tab-btn {
                        color: var(--Colors-Use-Neutral-Text-1-Title);
                        font-size: 12px;
                        font-weight: 400;
                        line-height: 14px;
                        width: 12px;
                        writing-mode: vertical-rl;
                    }
                }
                .ant-tabs-tab + .ant-tabs-tab {
                    margin-top: 4px;
                }
                // 选中
                .ant-tabs-tab.ant-tabs-tab-active {
                    border-top: 1px solid var(--Colors-Use-Main-Border);
                    border-left: 1px solid var(--Colors-Use-Main-Border);
                    border-bottom: 1px solid var(--Colors-Use-Main-Border);
                    background: var(--Colors-Use-Main-Primary);
                    .ant-tabs-tab-btn {
                        color: var(--Colors-Use-Main-On-Primary);
                        text-shadow: unset;
                    }
                }
                // 禁用
                .ant-tabs-tab.ant-tabs-tab-disabled {
                    background: var(--Colors-Use-Neutral-Bg);
                    .ant-tabs-tab-btn {
                        color: var(--Colors-Use-Neutral-Disable);
                    }
                }
            }

            & > .ant-tabs-content-holder {
                border-left: 0;
                margin-left: 0;
                & > .ant-tabs-content > .ant-tabs-tabpane {
                    padding-left: 0;
                }
            }
        }

        // body
        .ant-tabs-content-holder {
            flex: 1;
            overflow: hidden;
            .ant-tabs-content {
                width: 100%;
                height: 100%;
            }
        }
    }
}
.plugin-tabs-line {
    width: 100%;
    height: 100%;
    overflow: hidden;
    :global {
        .ant-tabs-nav .ant-tabs-nav-list {
            border-bottom: 1px solid (--Colors-Use-Neutral-Border);
        }
        .ant-tabs-top {
            & > .ant-tabs-nav {
                height: 34px;
                margin-bottom: 0;
                &::before {
                    border-bottom: 1px solid (--Colors-Use-Neutral-Border);
                    z-index: 0;
                }
                .ant-tabs-ink-bar {
                    display: none;
                }

                // 基础样式
                .ant-tabs-tab {
                    padding: 4px 16px;
                    border: 0;
                    background: var(--Colors-Use-Neutral-Bg);
                    position: relative;
                    border-radius: 0;
                    &:hover {
                        background-color: var(--Colors-Use-Neutral-Bg);
                    }
                    .ant-tabs-tab-btn {
                        color: var(--Colors-Use-Neutral-Text-1-Title);
                        font-size: 12px;
                        font-weight: 600;
                        line-height: 16px;
                    }
                    .anticon {
                        margin-right: 8px;
                        svg {
                            width: 16px;
                            height: 16px;
                            color: var(--Colors-Use-Neutral-Text-3-Secondary);
                        }
                    }
                }
                .ant-tabs-tab + .ant-tabs-tab {
                    margin-left: 0;
                    &::before {
                        content: "";
                        position: absolute;
                        height: 16px;
                        width: 1px;
                        background-color: (--Colors-Use-Neutral-Border);
                        left: 0px;
                    }
                }
                // 选中
                .ant-tabs-tab.ant-tabs-tab-active {
                    border: 0;
                    background: var(--Colors-Use-Main-Bg);
                    color: var(--Colors-Use-Main-On-Primary);
                    &::after {
                        content: "";
                        position: absolute;
                        width: 100%;
                        bottom: -1px;
                        left: 0;
                        border-bottom: 3px solid var(--Colors-Use-Main-Primary);
                    }
                    .ant-tabs-tab-btn {
                        color: var(--Colors-Use-Main-Primary);
                        text-shadow: unset;
                    }
                    .anticon {
                        svg {
                            color: var(--Colors-Use-Main-Primary);
                        }
                    }
                }
                // 禁用
                .ant-tabs-tab.ant-tabs-tab-disabled {
                    background: var(--Colors-Use-Neutral-Bg);
                    .ant-tabs-tab-btn {
                        color: var(--Colors-Use-Neutral-Disable);
                    }
                }
            }
        }
    }
}
